<template>
     <!-- <div class="swiper" >
         <div class="sw"  v-for="(item,index) in list" :key="index">
                <img :src="item.bannerUrl" alt="">
         </div>
     </div> -->
       <div class="swiper">
           <van-swipe v-if="list.length" class="my-swipe" :autoplay="3000" indicator-color="white">
        <van-swipe-item v-for="(item,index) in list" :key="index">
          <img :src="item.bannerUrl" alt="">
        </van-swipe-item>
      </van-swipe>
       </div>
</template>

<script>
  import {banner }from '../../../api/index'
export default {

      data(){ //定义响应式数据
    return {
      list:[

      ]
    }
  },
mounted(){
     banner().then((res)=>{
      // console.log(res.data.list);
      this.list=res.data.list
    })
  }

}
</script>

<style scoped>
    .swiper{
        width: 95%;
        padding: 10px;
        margin: 10px auto;
        box-sizing: border-box;
        border-radius: 5px;
        /* background-color:  rgb(34, 138, 202); */
    }
    img{
      width: 100%;
      
    }
    .sw{
      display: flex;
      flex-wrap: nowrap;
    }
</style>